<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">

    <!-- <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport"/> -->
    <meta content="yes" name="apple-mobile-web-app-capable"/>
    <meta content="black" name="apple-mobile-web-app-status-bar-style"/>
    <meta content="telephone=no" name="format-detection"/>
    <link href="../../../../han/han/css/style_login.css" rel="stylesheet" type="text/css"/>



    <title>忘记密码</title>
    <!-- <link rel="stylesheet" type="text/css" href="../../css/api.css"/> -->
    <!-- <link rel="stylesheet" type="text/css" href="../../css/style.css"/> -->
    <link rel="stylesheet" type="text/css" href="../../../../han/han/css/aui.css" />

    <style>

        html,body {
        height: 100%;
        background-color: #f0f0f0;
        }

        header{
            height: 40px;
            width: auto;
            background-color: white;
            display: -webkit-box;
            -webkit-box-orient: horizontal;
            -webkit-box-align: center;
            display: flex;
        }



        .backicon {
            width: 20px;
            height: 20px;
            display: block;
            border: none;
            float: left;
            background-size: 20px;
            background-repeat: no-repeat;

            margin: 10px ;
            opacity: 0.9;
            background-image:  url('');
            /*background-image:  url('bottombtn0101.png')*/
        }


    </style>

</head>
<script type="text/javascript" src="../../../script/api.js"></script>
<!-- <script type="text/javascript" src="../../script/template.js"></script>
<script type="text/javascript" src="../../script/doT.min.js"></script>
<script type="text/javascript" src="../../script/doT.js"></script> -->

<script>

    apiready = function(){

    };


</script>


<style>
body{

    background-color:#f0f0f0;
}



.box{
    /*margin:0 10%;*/
    /*height: 630px;*/
    /*overflow: hidden;*/
    padding: 10px 0 40px 60px
}

.box >ul{
    list-style-type: none;
    margin: 0;
    padding: 0;
    position: relative;
    transition: all 0.5s linear;
    top:0
}

/*.box ul:last-of-type{top:80px}*/

.box >ul:before{
    content: "";
    display: block;
    width: 0;
    height: 100%;
    border:1px dashed #fff;
    position: absolute;
    top:0;
    left:-30px
}

.box >ul li{
    margin: 20px 60px 60px;
    margin-left: 0px;
    margin-right:  0px;

    position: relative;
    padding: 10px 20px;
    background:rgba(255, 255, 255, 0.3);
    border-radius: 10px;
    line-height: 20px;
    /*width: 35%*/
}


.box ul li > span{
    content: "";
    display: block;
    width: 0;
    height: 100%;
    /*border:1px solid #fff;*/
    position: absolute;
    top:0;
    left:-30px
}

.box ul li > span:before{
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background:#ff6d6d;
    border:2px solid #fff;
    position: absolute;
    left:-7.5px
}

.box ul li > span:before{top:0px}
/*.box ul li > span:after{top:95%}*/




.box .time span{
    position: absolute;
    left: -100px;
    font-size:80%;
    font-weight: bold;
}
.box .time span:first-child{
    top:-2px;
    left: -20px;
    /*padding-top: 5px;*/

}
/*.box .time span:last-child{top:94%}*/

.info{
    padding-left: 10px;
}


</style>

<body>


<div class="box">
            <ul id="first-list">
                <li>
                    <span></span>
                    <div class="info">

                        <div style="border-left:5px solid #6078ff;position:absolute;top:0px;"> 我上传了2份资料</div>
                        <ul class="aui-list aui-list-in" style="margin-top:20px;">
                            <li class="aui-list-item">
                                <div class="aui-list-item-label-icon">
                                    <img src="../../../../han/han/image/pdf.png" alt="">
                                </div>
                                <div class="aui-list-item-inner">
                                    高数 - 大一 - 微积分 </br> 高数习题详解

                                </div>
                            </li>

                            <li class="aui-list-item">
                                <div class="aui-list-item-label-icon">
                                    <img src="../../../../han/han/image/pdf.png" alt="">
                                </div>
                                <div class="aui-list-item-inner">
                                    高数 - 大一 - 微积分 </br> 高数习题详解

                                </div>
                            </li>

                            <li class="aui-list-item">
                                <div class="aui-list-item-label-icon">
                                    <img src="../../../../han/han/image/pdf.png" alt="">
                                </div>
                                <div class="aui-list-item-inner">
                                    高数 - 大一 - 微积分 </br> 高数习题详解

                                </div>
                            </li>

                        </ul>
                    </div>
                    <div class="time">
                        <!-- <span>JUN, 17<sup>th</sup></span> -->
                        <span>09-14</span>
                    </div>
                </li>

                <li>
                    <span></span>
                    <div class="info">

                        <div style="border-left:5px solid #6078ff;position:absolute;top:0px;"> 我上传了2份资料</div>
                        <ul class="aui-list aui-list-in" style="margin-top:20px;">
                            <li class="aui-list-item">
                                <div class="aui-list-item-label-icon">
                                    <img src="../../../../han/han/image/pdf.png" alt="">
                                </div>
                                <div class="aui-list-item-inner">
                                    高数 - 大一 - 微积分 </br> 高数习题详解

                                </div>
                            </li>

                            <li class="aui-list-item">
                                <div class="aui-list-item-label-icon">
                                    <img src="../../../../han/han/image/pdf.png" alt="">
                                </div>
                                <div class="aui-list-item-inner">
                                    高数 - 大一 - 微积分 </br> 高数习题详解

                                </div>
                            </li>

                            <li class="aui-list-item">
                                <div class="aui-list-item-label-icon">
                                    <img src="../../../../han/han/image/pdf.png" alt="">
                                </div>
                                <div class="aui-list-item-inner">
                                    高数 - 大一 - 微积分 </br> 高数习题详解

                                </div>
                            </li>

                        </ul>
                    </div>
                    <div class="time">
                        <!-- <span>JUN, 17<sup>th</sup></span> -->
                        <span>09-14</span>
                    </div>
                </li>





                <li>
                    <span></span>
                    <div class="title">comment #02</div>
                    <div class="info">the best animation , the best toturials you would ever see . what about canvas ?? do you like it ..</div>
                    <div class="name">- dr. ahmed -</div>
                    <div class="time">
                        <span>FEB, 2<sup>nd</sup></span>
                        <span>02:00 PM</span>
                    </div>
                </li>

                <li>
                    <span></span>
                    <div class="title">comment #02</div>
                    <div class="info">the best animation , the best toturials you would ever see . what about canvas ?? do you like it ..</div>
                    <div class="name">- dr. ahmed -</div>
                    <div class="time">
                        <span>FEB, 2<sup>nd</sup></span>
                        <span>02:00 PM</span>
                    </div>
                </li>

                <li>
                    <span></span>
                    <div class="title">comment #02</div>
                    <div class="info">the best animation , the best toturials you would ever see . what about canvas ?? do you like it ..</div>
                    <div class="name">- dr. ahmed -</div>
                    <div class="time">
                        <span>FEB, 2<sup>nd</sup></span>
                        <span>02:00 PM</span>
                    </div>
                </li>

            </div>
            </ul>

        </div>

</body>

</html>
